<template>
	<view class="chooseWarehouse">
		<uni-list>
			<uni-list-item title="收件人" :rightText="orderDetail.username"></uni-list-item>
			<uni-list-item title="手机号" :rightText="orderDetail.phone"></uni-list-item>
			<uni-list-item title="收件地址">
				<!-- 自定义 footer-->
				<template slot="footer">
					<view class="address">{{orderDetail.address}}</view>
				</template>
			</uni-list-item>
			<uni-list-item title="订单状态" :rightText="orderDetail.status" link
				:to="`/pages/orderStatus/orderStatus?orderId=${orderDetail.orderId}`">
			</uni-list-item>
			<uni-list-item title="备注" :rightText="orderDetail.remarks" link
				:to="`/pages/note/note?remarks=${orderDetail.remarks}`"></uni-list-item>
			<uni-group v-for="(item,index) in orderDetail.shopList" :key="index" title="商品信息" mode="card">
				<uni-list-item title="商品名称" :rightText="item.name"></uni-list-item>
				<uni-list-item title="外箱编码" :rightText="item.caseCode"></uni-list-item>
				<uni-list-item title="瓶盒编码" :rightText="item.vaseCode"></uni-list-item>
				<uni-list-item title="数量" :rightText="item.count"></uni-list-item>
				<uni-list-item title="仓库库管选择">
					<template slot="footer">
						<uni-data-picker :localdata="items[index] || []" popup-title="请选择仓库和库管"
							@change="onchange($event,index)">
						</uni-data-picker>
					</template>
				</uni-list-item>
			</uni-group>
		</uni-list>
		<view class="buttonWrap">
			<button size="mini" type="primary" @click="handleSubmit">完 成</button>
			<button size="mini" @click="handleCancel">取 消</button>
		</view>
	</view>
</template>

<script>
	export default {
		name: "ChooseWarehouse",
		data() {
			return {
				// 仓库及库管
				items: [],
				orderDetail: {},
				warehouse: [],
				warehouseman: []
			}
		},
		onLoad(options) {
			this.orderDetail = JSON.parse(options.orderDetail)
		},
		onShow() {
			this.getWarehouse()
		},
		methods: {
			// 获取仓库与仓库管理员
			async getWarehouse() {
				try {
					const {
						data
					} = await this.request("warehouseCheck", {
						orderId: this.orderDetail.orderId
					})

					// 处理数据格式
					for (let warehouse of data.data) {
						const arr = warehouse.warehouseArray.map(item => {
							item.text = item.warhouse
							item.value = item.warhouse
							item.children = item.warehousemanList.map(man => {
								const manObj = {
									text: man,
									value: man,
								}
								return manObj
							})
							return item
						})
						this.items.push(arr)
					}
					console.log(this.items)
				} catch (e) {
					console.log(e)
				}
			},
			// 仓库选择
			onchange(e, index) {
				const value = e.detail.value
				console.log('onchange', value, index)
				this.warehouse[index] = value[0].text
				this.warehouseman[index] = value[1].text
			},
			// 完成接单
			async handleSubmit() {
				try {
					await this.request("takeOrder", {
						orderId: this.orderDetail.orderId,
						phone: this.phone,
						warehouse: this.warehouse,
						warehouseman: this.warehouseman,
					})

					uni.navigateBack()
				} catch (e) {
					console.log(e)
					uni.reLaunch({
						url: "/pages/index/index"
					})
				}
			},
			// 取消
			handleCancel() {
				uni.navigateBack()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.chooseWarehouse {
		padding-bottom: 40rpx;
	}
</style>
